<?php
Yii::app()->clientScript->registerScriptFile($this->staticsPath."/frontend/js/jquery.js",CClientScript::POS_HEAD);
Yii::app()->clientScript->registerScriptFile($this->staticsPath."/js/bootstrap.min.js",CClientScript::POS_HEAD);
Yii::app()->clientScript->registerCssFile($this->staticsPath."/css/global.css");
Yii::app()->clientScript->registerCssFile($this->staticsPath."/css/index.css");
Yii::app()->clientScript->registerCssFile($this->staticsPath."/css/font-awesome.min.css");
Yii::app()->clientScript->registerCssFile($this->staticsPath."/Font-Awesome-3.2.1/css/font-awesome.min.css");
Yii::app()->clientScript->registerCssFile($this->staticsPath."/css/bootstrap.min.css");
Yii::app()->clientScript->registerCss("CSS1","
    .cont_box img{
        height: 200px;
    }



");


?>
<style type="text/css">
    .main-box {

        height: 100%;
        left: 0;
        margin: 0 auto;
        position: absolute;
        top: 0;
        width: 100%;
        z-index: -1;
    }
    .morcon {
        height: 100px;
        margin: 245px 20px 20px;
        position: relative;
        text-align: center;
    }

    .morcon .reg {
        background: rgba(255, 255, 255, 0) none repeat scroll 0 0;
        border: medium none;
        color: #fff;
        font-size: 20px;
        left: 4%;
        position: absolute;
        top: 0;
    }
    .morcon .login {
        background: rgba(255, 255, 255, 0) none repeat scroll 0 0;
        border: medium none;
        color: #fff;
        display: block;
        font-size: 20px;
        left: 51%;
        position: absolute;
        top: 39%;
    }

    .wrap .header{
        width: 100%;
        position: relative;
        height: 300px;
    }
    .wrap .footer {
        height: 300px;
        position: relative;
        width: 100%;
    }

    .child_zw{
        cursor:pointer;
    }
    .imgbg .box img {
        border-radius: 50%;
        height: 80%;
        left: 15px;
        position: absolute;
        top: 15px;
        width: 80%;
    }
    .wrap .header .hname {
        height: 200px;
        left: 170px;
        position: absolute;
        top: 144px;
        width: 200px;
    }
    .wrap .header .hname p{
        color: #0066b3;
        font-size: 20px;
    }
    .wrap .header .list {


        height: 80px;
        left: 25px;
        position: absolute;
        top: 25px;
        width: 80px;
    }
    .wrap .header .list a{
        color: #0066b3;
        font-size: 30px;
    }


    body{
        background: #f4f4f4 none repeat scroll 0 0;
    }
    .activity_list h3 {
        border-bottom: 1px solid #e2e1e1;
    }
    .scenic_sum h3 {
        color: #507fbd;
        font-size: 16px;
        margin-bottom: 1px;
        margin-top: 1px;
        min-height: 15px;
        padding-bottom: 22px;
    }
    .alert-danger, .alert-error {
        background-color: #f2dede;
        border-color: #eed3d7;
        color: #b94a48;
        text-align: center;
    }
    .fl{
        float: left;
    }
    .lbox{
        width: 30%;
    }
    .rbox{
        margin-left: 20px;
        margin-top:12px;
    }
    .rbox .fot{
        font-size: 16px;
    }
    .nav {
        background: rgb(249, 249, 249) none repeat scroll 0 0;
        border-top: 1px solid #ddd;
        bottom: 0;
        opacity: 0.9;
        padding: 6px 0 !important;
        position: fixed;
        width: 100%;
        height: 55px;
    }
    .nav .nav-box {
        color: #333;
        float: left;
        font-size: 14px;
        text-align: center;
        width: 33%;
        height: 100%;
    }
    .scenic_sum {
        background: #fff none repeat scroll 0 0;
        border-bottom: medium none;
        border-top:  medium none;
        line-height: 24px;
        margin-bottom: 0;
        padding: 10px;
    }
    .scenic_sum h3 {
        height: auto;
    }
</style>

<div class="data"  >
    <header class="homeHder header">





        <div class="hder_logo">课堂评价</div>
        <div class="hder_urse flor"><a  id="logOut"  href="javascript:void(0);"><i class="fa fa-sign-out"></i></a></div>
        <script type="text/javascript">
            $(function(){
                $("#logOut").click(function(){
                    if(window.confirm('你确定要退出吗？')){
                        $.ajax({
                            type: "POST",
                            url: '<?php echo Yii::app()->createUrl('observation/logOut') ?>',
                            data: {
                                'openid':'<?php echo $openid ?>'
                            },
                            dataType: "json",
                            success: function (data) {

                                if (data) {
                                    if(data.status==1){

                                        window.location.reload();
                                    }else{
                                        alert(data.message);
                                        return false;
                                    }
                                }else{
                                    alert('操作失败');
                                    return false;
                                }
                            }
                        });
                    }
                });
                $("#cj").click(function(){
                    if(window.confirm('你确定要创建随堂课吗？')){
                        window.location.href="<?php echo $this->createUrl('createOpen') ?>";
                    }
                });
            });
        </script>
    </header>

    <section class="wrap">
        <div class="container-fluid">
            <?php if($array[0]==1){ ?>
            <div class="row">
                <div class="container-fluid">
                    <div class="row">
                        <div style="margin:20px auto;text-align: center;">
                            <button id="cj" type="button" class="btn btn-primary btn-lg">创建随堂课</button>
                        </div>
                    </div>
                </div>
            </div>
            <?php } ?>

            <div class="row">
                <div class="container-fluid">
                    <div class="row">
                        <div style="margin:20px auto;text-align: center;">
                            <div class="btn-group" >
                                <label data-type="1" class="Ckey btn btn-primary active">
                                    当前课程
                                </label>
                                <label data-type="2" class="Ckey btn btn-primary">
                                    历史课程
                                </label>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <input type="hidden" id="Ckey" value="1">
            <div class="container-fluid">
                <div class="row">
                    <ul class="activity bor" id="Xbox">
                        <?php if($list){ ?>
                            <?php foreach($list as $v){ ?>
                                <li>
                                    <a class="img_type clickUrl" data-type="<?php echo $openid; ?>" data-id="<?php echo $v['id']; ?>" href="javascript:void(0);">
                                        <div class="scenic_sum activity_list clearfix">
                                            <h3><?php echo $v['user_name'] ?>：<?php echo $v['title'] ?>
                                                <?php if($v['status']==0){ ?>
                                                    【未开始】
                                                <?php }elseif($v['status']==1){ ?>
                                                    【上课中】
                                                <?php }else{ ?>
                                                    【已结束】
                                                <?php } ?>
                                            </h3>
                                            <div class="">
                                                <div class="rbox">
                                                    <p class="fot"><?php echo date('Y/m/d H:i',$v['start_time']) ?> - <?php echo date('H:i',$v['end_time']) ?></p>
                                                    <p class="fot"><?php echo $v['info'] ?></p>
                                                    <?php if($v['ctype']){ ?>
                                                        <?php $aaa = explode(" ",$v['ctype']);
                                                        ?>

                                                        <p class="fot">课程身份：
                                                            <?php if(in_array("ls", $aaa)){ ?>上课老师<?php } ?>

                                                            <?php if(in_array("gc", $aaa)){ ?>观察者<?php } ?>

                                                            <?php if(in_array("tk", $aaa)){ ?>听课老师<?php } ?>

                                                            <?php if(in_array("zj", $aaa)){ ?>专家<?php } ?>
                                                        </p>

                                                    <?php } ?>


                                                    <div class="clearfix"></div>
                                                </div>
                                            </div>
                                            <p style="border-top: 1px solid rgb(226, 225, 225); margin-bottom: 0px; padding-top: 12px;">教室：<?php echo $v['room'] ?> <span style="float: right">进入课堂>></span></p>
                                        </div>
                                    </a>
                                </li>
                            <?php } ?>
                        <?php }else{ ?>
                            <li>
                                <div class="alert alert-error" style="" id="alt">
                                    暂无任何数据
                                </div>
                            </li>
                        <?php } ?>
                    </ul>
                    <div class="alert alert-info" style="text-align: center; display: none;" id="loadings">
                        <i class="fa fa-circle-o-notch fa-spin"></i>&nbsp;正在加载中...
                    </div>

                    <div class="alert alert-error" style="display: none;" id="alt">
                        没有更多啦！
                    </div>
                </div>
                <br>
                <br>
                <br>
                <br>
            </div>

            <div class="modal fade" id="Xalert" data-id="1" tabindex="-1" role="dialog" aria-labelledby="linkModalLabel" aria-hidden="true">
                <div class="modal-dialog">
                    <!-- 登陆页面注册提示 -->
                    <div class="modal-content text-left">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                            <h4 class="modal-title">提示</h4>
                        </div>
                        <div class="modal-body">
                            <p id="alertMassage"></p>
                            <button type="button" style="margin-top: 20px" class="btn btn-primary" data-dismiss="modal">关闭</button>
                        </div>
                    </div>
                </div>
            </div>

            <script type="text/javascript">
                function Xalert(html){
                    $("#alertMassage").html(html);
                    $("#Xalert").modal();
                    setTimeout(function(){$("#Xalert").modal('hide')},2000);
                }
                $("body").on("click",".clickUrl", function () {
                    var _this = $(this);
                    var openid = _this.attr("data-type");
                    var id = _this.attr("data-id");
                    $.ajax({
                        url:'<?php echo $this->createUrl('checkRole') ?>',
                        type : 'GET',
                        data:{
                            id:id,
                            openid:openid,
                        },
                        dataType:'json',
                        success : function (data,response,status) {
                            if(data){
                                if(data['url']==''){
                                    Xalert('此课程还没有结束，如需查看，请等待课程结束后方可查看');
                                }else{
                                    window.location.href=data['url'];
                                }
                            }
                        }
                    });
                });
                var currentPage = 0;
                var isloading = false;
                $(".Ckey").click(function(){
                    var _this = $(this);
                    var key = _this.attr('data-type');
                    currentPage = 0;
                    $('#alt').hide();
                    isloading = false;
                    $("#Ckey").val(key);
                    $.ajax({
                        url:'<?php echo $this->createUrl('ajaxOpen') ?>',
                        type : 'GET',
                        data:{
                            page:0,
                            openid:'<?php echo $openid ?>',
                            key:key
                        },
                        dataType:'html',
                        beforeSend : function() {
                            $('#loadings').show();
                            $(".Ckey").removeClass('active');
                            _this.addClass('active');
                            isloading = true;
                        },
                        success : function (data,response,status) {
                            if(data){
                                $('#Xbox').html(data);
                                isloading = false;
                                $('#loadings').hide();
                            }else{
                                $('#Xbox').html('');
                                isloading = true;
                                $('#loadings').hide();
                                $('#alt').show();
                            }
                        }
                    });
                });



                $(function(){
                    $(window).scroll(function(){
                        var key = $("#Ckey").val();
                        if($(window).scrollTop() + 100 >= $(document).height() - $(window).height()){
                            if (isloading == true){  //如果loading为真 则return false;
                                return false;
                            }
                            currentPage = currentPage + 1;
                            isloading = true; //为真了
                            $.ajax({
                                url:'<?php echo $this->createUrl('ajaxOpen') ?>',
                                type : 'GET',
                                data:{
                                    openid:'<?php echo $openid ?>',
                                    key:key,
                                    page:currentPage
                                },
                                dataType:'html',
                                beforeSend : function() {
                                    $('#loadings').show();
                                    isloading = true;
                                },
                                success : function (data,response,status) {
                                    if(data){
                                        $('#Xbox').append(data);
                                        isloading = false;
                                        $('#loadings').hide();
                                    }else{
                                        isloading = true;
                                        $('#loadings').hide();
                                        $('#alt').show();
                                    }
                                }
                            });
                        }
                    });

                });
            </script>


        </div>
    </section>
</div>

